let titled=document.querySelector('.titled');
let list=document.querySelector('.list');
fetch("http://chst.vip:1234/api/getbaicaijiatitle?pageid=1")
.then(body=>body.json())
.then(res=>{
    console.log(res)
    let arr=res.result;
    let el="";
    arr.forEach(item => {
        el+=` <li titleid=${item.titleId}>${item.title}</li>`
    });
    titled.innerHTML=el;
}) 
titled.onclick=function(e){
    if(e.target.localName='li'){
        let _this=e.target;
        $(_this).attr('class','active').siblings().removeAttr('class');
        let id=_this.getAttribute('titleid');
        console.log(id);
        fetch("http://chst.vip:1234/api/getbaicaijiaproduct?titleid="+id)
        .then(body=>body.json())
        .then(res=>{
            console.log(res)
            let listArr=res.result;
            let str=''; 
            listArr.forEach(item=>{
                str+=` <li>
                ${item.productImg}
                <div class="right">
                <h2> ${item.productName}</h2>
                <div class='price'>${item.productPrice}</div>
                ${item.productCouponRemain}
                <div class='btn'>${item.productCoupon}</div>
               <div class='go'>${item.productHref} </div>
                </div>
            </li>`;
            })
            list.innerHTML=str;
            
        })
    }
}

window.onload=function(){
    fetch("http://chst.vip:1234/api/getbaicaijiaproduct?titleid=0")
    .then(body=>body.json())
    .then(res=>{
        console.log(res)
        let listArr=res.result;
        let str='';
        listArr.forEach(item=>{
            str+=` <li>
            ${item.productImg}
            <div class="right">
            <h2> ${item.productName}</h2>
            <div class='price'>${item.productPrice}</div>
            ${item.productCouponRemain}
            <div class='btn'>${item.productCoupon}</div>
           <div class='go'>${item.productHref} </div>
            </div>
        </li>`;
        })
        list.innerHTML=str;
       let w=$('.bar i span').css('width');
       let text=0;
       let paper=0;
       text=parseInt(text)
       console.log(text)
       w=parseInt(w);
       console.log(w)
       let stop=setInterval(function(){
        w++;
        text++;
        paper++;
        if(text>100){
            text=100;
        }
        // console.log(w)
        $('.bar i span').css('width',w+'px');
        $('.bar i span').text(text+'%');
        $('.bar b').html('已领'+paper+'张/<br > 剩余'+(108-paper)+'张')
        if(w>=118){
            clearInterval(stop);
        }
    },50)
    })
    
}
